<template>
	<div class="">


		<van-nav-bar left-text="提现申请" left-arrow @click-left="onClickLeft" />
		<div class="" style="padding:0px 15px;">
			<div class="flex-c">
				<div class="" v-if="GetAccountList.nowValue"
					style="  padding: 45px 0px;font-weight: bold;color: #000000;font-size: 33px;font-family: Ebrima;margin-right: 11px;">
					{{GetAccountList.nowValue}}
				</div>
				<div class="" v-else
					style="padding: 45px 0px;font-weight: bold;color: #000000;font-size: 33px;font-family: Ebrima;margin-right: 11px;">
					0
				</div>
				<div class="" style="font-size: 14px;font-family: auto;font-weight: bold;color: #000000;">
					元
				</div>
			</div>

			<div class=""
				style="height: 62px;background: #FAFAFA;border-radius: 5px 5px 0px 0px;padding: 25px 21px ;color: #666666;font-weight: 500;font-size: 14px;font-family:auto">
				提现到银行卡 {{GetAccountList.cardNumCode}}
			</div>
			<div class="bg-f"
				style="height: 124px;padding: 0px 20px;font-weight: 500;color: #666666;font-size: 14px;font-family: auto">
				<div class=""
					style="padding: 25px 0px 36px 0px;font-size: 14px;font-family:auto;font-weight: 500;color: #666666;">
					提现金额:
				</div>
				<div class="flex-space flex-c">
					<div class="flex-c">
						<div class=""
							style="margin-right: 21px;font-size: 23px;font-family:auto ;font-weight: bold;color: #000000;">
							¥
						</div>
						<div class="" style="font-size: 19px;font-family: auto;font-weight: 500;color: #BBBBBB;">
							<input type="number" v-model="num" placeholder="最低1元起提"
								style="border: 0;outline: none;" /><label for=""></label>
						</div>
					</div>
					<div class="flex-c" @click="all"
						style="width: 57px;height: 33px;border: 1px solid #F8B800;border-radius: 5px;font-size: 14px;font-family:auto;font-weight: 500;color: #F8B800;">
						全部
					</div>
				</div>
			</div>

			<div class="flex-align" style="padding:23px 0px 47px 20px ;">
				<div class="" style="width: 6px;height: 6px;background: #BBBBBB; border-radius: 50%;margin-right: 8px;">
				</div>
				<div class="" style="font-size: 12px; font-family:auto; font-weight: 500; color: #BBBBBB;">
					每天的提现申请将会在下个工作日到账
				</div>
			</div>
			<div class="flex-c" @click="submitpay"
				style="height: 45px;background: #0580FF;border-radius: 23px;font-size: 15px;font-family:auto;font-weight: bold;color: #FFFFFF;margin-bottom: 20px;">
				提现
			</div>
			<div class="flex-c" style="font-size: 12px;font-family: auto;font-weight: 500;">
				<span style="color: #BBBBBB;">提现费率:</span><span style="color: #0580FF;">{{GetAccountList.rate}}</span>
			</div>
		</div>
		<!-- 显示遮罩层 -->
		<van-overlay :show="show" style=" ">
			<div class="wrapper">
				<div class="block">
					<div id=""
						style="margin: 23px 0px 28px 0px;font-size: 17px;font-family: auto;font-weight: bold;color: #000000;">
						提示
					</div>
					<div id=""
						style="margin-bottom: 23px;font-size: 14px;font-family:  auto;font-weight: bold;color: #000000;">
						{{message}}
					</div>
					<div class="flex-c" @click="isshow"
						style="width: 271px;height: 38px;background: #FF0000;
					border-radius: 5px;font-size: 16px;margin: 0px 21px;margin-bottom: 24px;font-family: auto;font-weight: 500;color: #FFFFFF;">
						退出
					</div>
				</div>
			</div>
		</van-overlay>
	</div>
</template>
<script>
	import {
		GetList
	} from '@/api/my/GetList.js'
	import {
		GetAccountBalance
	} from '@/api/my/GetAccountBalance.js'
	import {
		AddRow
	} from '@/api/my/AddRow.js'
	import {
		DropdownMenu,
		DropdownItem,
		Toast
	} from 'vant'
	export default {
		data() {
			return {
				switchChecked: false, //全部提现
				num: '', //输入的金额
				option: [],
				GetAccountList: {}, //账户余额信息
				projectName: '',
				projeId: '',
				radio: '1',
				// index: 0,
				show: false, //控制遮罩层
				message: '', //遮罩层的显示内容
			}
		},
		created() {
			// this.Get();
			this.GetAccount(); //获取账户余额
		},
		methods: {
			all() {
				this.num = this.GetAccountList.nowValue;
			},
			// 控制遮罩层
			isshow() {
				this.show = false;
				this.$router.go(-1)
			},
			switchch() {
				this.switchChecked = !this.switchChecked;
				console.log(this.switchChecked)
			},
			horizontal() {
				console.log('封闭而非')
			},
			// 提交提现
			submitpay() {
				if (this.GetAccountList.nowValue == '') {
					Toast('余额不足');
					return;
				}
				if (this.GetAccountList.nowValue < this.num) {
					Toast('自己多少钱没点数吗？');
					return;
				}

				if (this.num == '') {
					Toast('输入金额了吗你？');
					return;
				}
				// // 手动输入的金额
				this.addrow(this.num);

			},
			addrow(item) {
				AddRow({
					items: [{
						projectId: "ACE712042E984293A8D4008126780EF5", //si
						itemDirection: 0, //si
						itemRate: this.GetAccountList.rate,
						itemTaxAmount: item,
					}],
					orderDirection: '0', //si
					orderType: "1", //si
					orgId: this.GetAccountList.orgId,
					shopId: this.GetAccountList.shopId,
          
          
				}).then(res => {
					Toast.success(res.message);
					console.log(res, 'res')
				})
			},
			onClickLeft() {
				this.$router.go(-1)
			},
			GetAccount() {
				GetAccountBalance({
					"postdata": [{
						"field": "type",
						"value": "1"
					}]
				}).then(res => {
					if (res.success) {
						this.GetAccountList = res.data;
						console.log(res, '获取账户余额')
					} else {
						this.show = true;
						this.message = res.message;
					}
				})
			}
		}
	}
</script>

<style>
	.wrapper {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.block {
		/* width: 312px; */
		/* height: 100px; */
		text-align: center;
		margin: 0px 31px;
		background: #FFFFFF;
		border-radius: 5px;
	}

	/* .block>div:first-child {
		padding: 10px;
		font-size: 17px;
		font-weight: bolder;
		font-family: system-ui;
		border-radius: 10px;
	} */



	.bg-f {
		border-radius: 5px;
		background-color: #FFFFFF;
	}
</style>
